    var otm = document.querySelector(".timu")
    var onr = document.querySelector(".neirong")
    var oda = document.querySelector(".daan")
    var obtz = document.querySelector(".zuo_bt")
    var obty = document.querySelector(".you_bt")
    var obtt = document.querySelector(".t_bt")
    var timer = null
    var flag = true
    var mark = 0
    obty.onclick = function () {
        if (!flag) return
        flag = false
        oda.style.display = 'none'
        timer = setInterval(function () {
            var cont = parseInt(Math.random() * 17 + 1)
            otm.innerText = "第" + cont + "题"
            changenr(cont)
            mark = cont
        }, 50)
    }
    obtt.onclick = function () {
        clearInterval(timer)
        flag = true
    }
    obtz.onclick = function () {
        oda.style.display = 'block'
        changedaan(mark)
    }
    function changenr(x) {
        switch (x) {
            case 1:
                onr.innerText = '将json字符串 "{"name":"zs"}"转为json对象的语法？'
                break;
            case 2:
                onr.innerText = "this指向有哪些？ 改变this指向的方法有哪些？"
                break;
            case 3:
                onr.innerText = "let和var的区别？let和const的区别？"
                break;
            case 4:
                onr.innerText = "简述for..in循环和for..of循环的区别？"
                break;
            case 5:
                onr.innerText = "简述字符串中和正则 相关的api，并简述含义和返回值？"
                break;
            case 6:
                onr.innerText = "写一个正则，用于匹配任意一个或者多个数字？"
                break;
            case 7:
                onr.innerText = "什么是事件对象，写出鼠标事件对象的属性有哪些？区别是什么？"
                break;
            case 8:
                onr.innerText = "写出键盘事件对象的属性有哪些？"
                break;
            case 9:
                onr.innerText = "什么是事件委托，事件委托的好处是什么？"
                break;
            case 10:
                onr.innerText = "写出鼠标事件类型，键盘事件类型，表单事件类型？"
                break;
            case 11:
                onr.innerText = "事件绑定的方式有哪些？区别是什么？"
                break;
            case 12:
                onr.innerText = "DOM操作样式时，获取样式的语法有哪些,含义是？"
                break;
            case 13:
                onr.innerText = "DOM操作属性时，操作属性的语法有哪些？"
                break;
            case 14:
                onr.innerText = "DOM的创建元素节点，尾部追加，插入，克隆，替换，的语法？"
                break;
            case 15:
                onr.innerText = "写出数组中能改变原数组的api有哪些？"
                break;
            case 16:
                onr.innerText = " 什么样的函数可以改造成箭头函数，怎么改？"
                break;
            case 17:
                onr.innerText = "基本数据类型和引用数据类型的区别？"
                break;
            default:
                break;
        }
    }
    function changedaan(x) {
        switch (x) {
            case 1:
                oda.innerText = `JSON.stringify(对象)`
                break;
            case 2:
                oda.innerText = `事件：this绑定的事件源\n
                对象的方法中的this：this指向对象本身\n
   全局函数或者定时器或者 回调函数 ：window\n
                箭头函数中的this：不绑定this，this指向该箭头函数所在作用域中的this\n
                fn.call(obj,实参1,实参,...);\n
   fn.apply(obj,[实参1,实参,...]);\n
var newfn =  fn.bind(obj,实参1,实参,...);\n`
                break;
            case 3:
                oda.innerText = ` 1. 预解析：var有let 没有\n
  2. 块级作用域：let有 var有\n
  3. 变量名重复：var可以，let不可以\n
  4. 暂时性死区: let 有 var没有\n
  const: 声明即赋值，不能先声明后赋值，let可以\n
  const：定义的常量不可以被修改，let可以`
                break;
            case 4:
                oda.innerText = `数组： for..in循环（遍历下标）和for..of（遍历的是元素）循环都可以，\n
   对象:  for..in循环\n
   set集合：for..of（遍历的是元素）\n
   map集合：for..of(遍历的是键值对)\n

   for(let item of map){\n
     item--->['username','zs']\n
   }\n


   [...new Set(arr)]`
                break;
            case 5:
                oda.innerText = `1. str.replace('/sb/g','xx')  返回替换后的字符\n
   2. str.search('字符串或者字符/正则') ： 返回找到首次出现的下标 ，找不到返回-1\n
   3. str.match(正则/g):  返回数组类型满足正则规则元素\n
`
                break;
            case 6:
                oda.innerText = `/^\d+$/`
                break;
            case 7:
                oda.innerText = `e.clientX\n
e.pageX\n
e.offsetX`
                break;
            case 8:
                oda.innerText = `keyCode\n
e.ctrlKey`
                break;
            case 9:
                oda.innerText = `未知`
                break;
            case 10:
                oda.innerText = `onmouseover 移入 \n
onmouseout  移出\n

onmouseenter 移入 \n
onmouseleave  移出\n

onmousedown\n
onmousemove\n
onmouseup\n

onclick\n
ondblclick\n
oncontextmenu\n


onkeydown\n
onkeypress\n
onkeyup`
                break;
            case 11:
                oda.innerText = `oBtn.onclick = function(){}\n
oBtn.onclick = function(){}\n
oBtn.addEventListener('click',function(){},false)\n
`
                break;
            case 12:
                oda.innerText = `ele.style.属性 不推荐\n
window.getComputedStyle(元素).属性\n
window.getComputedStyle(元素)['属性']\n
\n
ele.offsetWidth:获取元素的实际宽  width+border+padding\n
ele.clientWidth:获取元素的可视宽  border+padding\n
ele.offsetLeft：获取元素距离它具有定位的父元素的左偏移量，如果父元素无定位，相对于 浏览器窗口\n
ele.offsetTop：：获取元素距离它具有定位的父元素的上偏移量，如果父元素无定位，相对于 浏览器窗口\n
`
                break;
            case 13:
                oda.innerText = `ele.固有属性\n

ele.id   ele.id =1\n
ele.src   ele.src =''\n
ele.checked   ele.checked = true/false\n
ele.disabled   ele.disabled = =true、false\n
ele.href\n
\n
自定义属性\n
ele.setAttribute("属性名",'属性值')\n
ele.getAttribute("属性名")\n
ele.removeAttribute("属性名")\n
\n
ele.dataset.id = '1'\n
ele.dataset.id`
                break;
            case 14:
                oda.innerText = `未知`
                break;
            case 15:
                oda.innerText = `未知`
                break;
            case 16:
                oda.innerText = `未知`
                break;
            case 17:
                oda.innerText = `未知`
                break;

            default:
                break;
        }
    } 